<template>
	<scroll-view scroll-y="true" class="scoll-viewS" @scrolltolower="scrolltolower" lower-threshold="400"
		@scroll="scroll" :scroll-top="scrollTop">
		<view class="qiangdanchenggong">
			<view class="titile">
				抢单成功
			</view>
			<view class="mt24 error flex_x_center">
				<u-icon name="checkmark-circle-fill" size="30" color="#FD5241"></u-icon>
				<view class="ml12">
					请尽快上门服务
				</view>
			</view>
			<view class="top bac flex_ac mt32">
				<view class="" v-if="data.images && data.images[0]">
					<image class="goodsimg" :src="$wanlshop.oss(data.images[0])" mode="">
					</image>
				</view>
				<view class="ml24 flex1 overflow_1">
					<view class="flex">
						<u-icon v-if='data.level== 2' name="https://img.aibbyp.com/wechatUser/jiazhuang.png"
							size="60"></u-icon>
						<u-icon v-if='data.level== 3' name="https://img.aibbyp.com/wechatUser/gongzhuang.png"
							size="60"></u-icon>
						<view class="f32 fb ml12 flex1 overflow_1">
							{{data.title}}
						</view>
					</view>
					<view class="flex overflow_1 mt12">
						<u-icon name="map" color="#FD5241" size="28"></u-icon>
						<view class="ml12 flex1 overflow_1">
							{{data.address}}
						</view>
					</view>
				</view>
				<view class="ml24">
					<u-button type="info" size="mini" plain
						@click="$wanlshop.to('/pages/craftsman/details?me=true&id='+data.id)">查看订单</u-button>
				</view>

			</view>

			<view class="pg32" v-if="user.level === 3">
				<view class="bac flex_ac">
					<u-icon name="https://img.aibbyp.com/wechatUser/craftsman/gj.png" size="72"></u-icon>
					<view class="f24 ml24 flex1">
						<view class="">
							公司缺少对应项目工匠师傅？
						</view>
						<view class="info">
							一键招募附近工匠？
						</view>
					</view>
					<u-button type="primary" size="mini" v-if="user.level == 3"
						@click="$wanlshop.to('/pages/craftsman/company/recruitingCraftsmen?id='+data.id)">去招募</u-button>
				</view>
			</view>
			<view class="tac error mt24 f24" v-if="user.level === 2">
				<u-icon name="info-circle-fill" color="#FD5241" size="30"></u-icon>
				<text class="ml12"> 待该订单完成后，才可抢下一单，请师傅认真完成</text>
			</view>
			<!-- 猜你喜欢 -->
			<view>

				<wanl-product :shopnameType="true" :dataList="likeData" />
				<uni-load-more :status="status" :content-text="contentText" />
				<view class="edgeInsetBottom"></view>
			</view>
		</view>
	</scroll-view>
</template>

<script>
	export default {
		data() {
			return {
				user: uni.getStorageSync('wanlshop:user'),
				data: {},
				likeData: [],
				isTop: false,
				isTopOld: false,
				scrollTop: 0,
				old: {

					scrollTop: 0

				},
				settingTop: true,
				reload: true,
				current_page: 1, //当前页码
				last_page: 1, //总页码
				status: 'loading',
				contentText: {
					contentdown: ' ',
					contentrefresh: '正在加载...',
					contentnomore: '没有更多数据了'
				},
			}
		},

		onLoad(option) {
			this.orderDetail(option.id)
			this.loadlikeData()
		},
		methods: {
			orderDetail(id) {
				this.$api.post({
					url: '/worker/task/orderDetail',
					data: {
						order_id: id
					},
				}).then(res => {
					this.data = res
				})
			},
			scroll(e) {
				this.settingTop = e.detail.scrollTop > 200 ? true : false
				let tmpY = 50;
				let scrollTop = e.detail.scrollTop > tmpY ? 50 : e.detail.scrollTop; //如果当前高度大于250则250否则当前高度
				this.headerOpacity = scrollTop * (1.0 / tmpY); //$headerOpacity 赋值当前高度x（1÷250） 

				let color = this.headerOpacity > 0.5 ? '#ffffff' : '#000000';


				let g = this;
				this.old.scrollTop = e.detail.scrollTop
				this.isTop = e.detail.scrollTop >= 667 ? true : false


			},

			scrolltolower() {
				console.log(1);
				if (this.current_page >= this.last_page) {
					this.status = 'noMore';
				} else {
					this.reload = false;
					this.current_page = this.current_page + 1; //页码+1
					this.status = 'loading';
					this.loadlikeData();
				}
			},
			// 滚动底部加载猜你喜欢
			async loadlikeData() {
				this.$api.get({
					url: '/wanlshop/product/likes?pages=user',
					data: {
						page: this.current_page,
						limit: 10,
					},
					success: res => {
						this.likeData = this.reload ? res.data : this.likeData.concat(res
							.data); //评论数据 追加
						this.current_page = res.current_page; //当前页码
						this.last_page = res.last_page; //总页码
						this.status = res.total == 0 ? 'noMore' : 'more';
					}
				});
			},
		},
	}
</script>

<style lang="scss" scoped>
	.scoll-viewS {
		width: 100vw;
		height: calc(110vh - 50px);
	}

	.qiangdanchenggong {
		background-image: url('https://img.aibbyp.com/wechatUser/craftsman/ssad.png');
		background-size: 100% 1042rpx;
		background-color: #fff;
		background-repeat: no-repeat;
		padding-top: 50rpx;

		.goodsimg {
			width: 104rpx;
			height: 104rpx;
			border-radius: 8rpx 8rpx 8rpx 8rpx;
		}

		.bac {
			padding: 20rpx 30rpx;
			border-radius: 20rpx;
			background: #fff;
		}

		.titile {
			font-size: 52rpx;
			color: #1A1A1A;
			text-align: center;
		}
	}
</style>